<!--
 * @Author: zhangyang
 * @Date: 2022-03-01 11:01:20
 * @LastEditTime: 2022-03-05 16:18:21
 * @Description: 独立页面
-->
<script lang="ts" setup>
import type { CSSProperties } from 'vue';

const changeBg = (style: CSSProperties) => {
  nextTick(() => {
    const dom = document.querySelector('.main') as HTMLElement;
    if (dom) {
      for (const [key, value] of Object.entries(style)) {
        // @ts-ignore
        dom.style[key] = value;
      }
    }
  });
};
</script>

<template>
  <div class="main">
    <router-view @set-bg="changeBg" />
  </div>
</template>

<style lang="scss" scoped>
.main {
  width: 100vw;
  height: 100vh;
  background-color: rgb(250, 250, 252);
  @apply flex items-center justify-center opacity-98;
}
</style>